<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
  #d1{
    width:150px;
    height:50px;
    border: 1px solid red;
    /* 水平对齐方式:left/right/center */
    text-align: center; 
    /* 文本修饰  overline上划线   underline下划线   line-through删除线*/
    text-decoration: line-through;
    /* 文本颜色  */
    color: red;
    /*  行高   可以实现垂直居中*/
    line-height: 50px;
    /* 字体大小  */
    font-size: 20px;
  }
  a{
  /* 去掉超链接自带的下划线  */
  text-decoration: none;
  }
  #d2{
  width:200px;
  height:100px;
  background-color: green;
  text-align: center;
  list-height:100px ;
  font-size: 15px;
  border: 2px solid blue;
  border-radius:10px ;
  margin: 50px 0 0 50px;
  padding-top: 20px;
  text-decoration: line-through;
  }
  p{
  /*  字体加粗  */
  /*  font-weight: bold;   */
  /*   字体设置    */
  /*  font-family: 黑体;    */
  /*   字体大小+字体设置   */
  font: 30px  黑体;
  
  
  
  }
  h1{
  /*  去掉加粗效果  */
  font-weight: normal;
  /*  斜体   */
  font-style: italic;
  }
</style>
</head>
<body>
<h1>这是h1</h1>
<p>这是个p</p>
  <a href="http://doc.tedu.cn">超链接</a>
  <div id="d1">今天吃点啥?</div>
  <!-- 给d2添加样式
  宽高200*100 背景颜色 水平和垂直都居中
  字体大小15px 圆角10px 上左外边距各50px
  上内边距20px 添加删除线-->
  <div id="d2">写完吃饭</div>
</body>
</html>